<%@ page import="com.online_video.entity.VideoPage" %>
<%@ page import="com.online_video.entity.Video" %>
<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    User user = (User) session.getAttribute("user");
    System.out.println(user);
    String parm = request.getParameter("parm");
    String category = request.getParameter("category");
    System.out.println(parm);
    VideoPage pageObj = (VideoPage) request.getAttribute("page");
    System.out.println(pageObj.getPageNo());
    List<Video> videoList = pageObj.getItems();
    System.out.println(videoList);
    String currentCategory = "";
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>
    <link rel="stylesheet" href="../js/bootstrap-3.4.1-dist/css/bootstrap.min.css">
    <script type="text/javascript" src="../js/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../css/video_list.css">

</head>
<body>
<!--导航条-->
<%@include file="plugins/navbar.jsp" %>

<div class="container" style="margin-top: 60px;">
    <!--综合排序-->
    <div class="col-sm-6 order">
        <div class="col-sm-6">
            <h5>综合排序</h5>
        </div>
        <div class="col-sm-1 orderdiv"><a href="#">上传时间<img src="../webImg/升降.png"></a></div>
        <div class="col-sm-1 orderdiv"><a href="#">播放数量<img src="../webImg/升降.png"></a></div>
        <div class="col-sm-1 orderdiv"><a href="#">收藏数量<img src="../webImg/升降.png"></a></div>
    </div>

    <!--一级分类-->
    <div class="col-sm-6 order">
        <div class="col-sm-6">
            <h5>一级分类</h5>
        </div>
        <div class="col-sm-1 typediv"><a onclick="setCategory('全部')"
                                         href="./video.do?action=page&parm=&category=">全部</a></div>
        <div class="col-sm-1 typediv"><a onclick="setCategory('电影')"
                                         href="./video.do?action=page&category=电影&parm=">电影</a></div>
        <div class="col-sm-1 typediv"><a onclick="setCategory('动漫')"
                                         href="./video.do?action=page&category=动漫&parm=">动漫</a></div>
        <div class="col-sm-1 typediv"><a onclick="setCategory('历史')"
                                         href="./video.do?action=page&category=历史&parm=">历史</a></div>
        <div class="col-sm-1 typediv"><a onclick="setCategory('战争')"
                                         href="./video.do?action=page&category=战争&parm=">战争</a></div>
        <div class="col-sm-1 typediv"><a onclick="setCategory('记录')"
                                         href="./video.do?action=page&category=记录&parm=">记录</a></div>
        <div class="col-sm-1 typediv"><a onclick="setCategory('综艺')"
                                         href="./video.do?action=page&category=综艺&parm=">综艺</a></div>
    </div>

    <!--导航路径-->
    <ol class="breadcrumb">
        <li><a href="index.jsp">首页</a></li>
        <li><a href="video_list.jsp">搜索</a></li>
        <li class="active" id="currentItems"><%=parm.equals("")?category:parm%></li>
    </ol>


    <!--影片-->
    <div>
        <div class="bs-example" data-example-id="thumbnails-with-custom-content">
            <div class="row" id="showVideo">
                <%
                    if (videoList == null) {
                        response.sendRedirect("./video.do?action=page");
                    } else {
                        for (int i = 0; i < videoList.size(); i++) {
                            Video videos = videoList.get(i);
                %>
                <div class="col-sm-6 col-md-3">
                    <div class="thumbnail">
                        <a href="./v.jsp?vid=<%=videos.getVid()%>"><img data-src="holder.js/100%x200" alt="100%x200"
                                         src="/online_video/img/<%=videos.getImg()%>"
                                         data-holder-rendered="true"
                                         style="height: 200px; width: 100%; display: block;"></a>
                        <div class="caption">
                            <h3><%=videos.getViName()%>
                            </h3>
                            <p><%=videos.getDescribe()%>
                            </p>
                        </div>
                    </div>
                </div>
                <%
                        }
                    }
                %>

            </div>
        </div>
    </div>

    <div>
        <nav aria-label="Page navigation" style="margin-left: 40%">
            <ul class="pagination">
                <%
                    if (pageObj.getPageNo() > 1) {
                %>
                <li>
                    <a href="./video.do?action=page&pageNo=1&pageSize=<%=pageObj.getPageSize()%>&parm=<%=parm%>&category=<%=category%>">首页</a>
                </li>
                <li>
                    <a href="./video.do?action=page&pageNo=<%=pageObj.getPageNo()-1%>&pageSize=<%=pageObj.getPageSize()%>&parm=<%=parm%>&category=<%=category%>"
                       aria-label="Previous">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
                <%
                    }
                %>

                <%
                    int beginPageNo = 0;
                    int endPageNo = 0;
                    //情况1：如果总页码小于等于5 的情况，页码的范围是：1-总页码
                    if (pageObj.getPageTotal() <= 5) {
                        beginPageNo = 1;
                        endPageNo = pageObj.getPageTotal();
                    } else {
                        //情况2：总页码大于5 的情况
                        if (pageObj.getPageNo() <= 3) {
                            //小情况1：当前页码为前面3 个：1，2，3 的情况，页码范围是：1-5
                            beginPageNo = 1;
                            endPageNo = 5;
                        } else if (pageObj.getPageNo() >= (pageObj.getPageTotal() - 2)) {
                            //小情况2：当前页码为最后3 个，8，9，10，页码范围是：总页码减4 - 总页码
                            beginPageNo = pageObj.getPageTotal() - 4;
                            endPageNo = pageObj.getPageTotal();
                        } else {
                            //小情况3：4，5，6，7，页码范围是：当前页码减2 - 当前页码加2
                            beginPageNo = pageObj.getPageNo() - 2;
                            endPageNo = pageObj.getPageNo() + 3;
                        }
                    }
                %>

                <%
                    for (int i = beginPageNo; i <= endPageNo; i++) {
                        if (i == pageObj.getPageNo()) {
                %>
                <li>
                    <a href="./video.do?action=page&pageNo=<%=i%>&pageSize=<%=pageObj.getPageSize()%>&parm=<%=parm%>&category=<%=category%>">【<%=i%>】
                    </a></li>
                <%
                } else {
                %>
                <li>
                    <a href="./video.do?action=page&pageNo=<%=i%>&pageSize=<%=pageObj.getPageSize()%>&parm=<%=parm%>&category=<%=category%>"><%=i%>
                    </a></li>
                <%
                        }
                    }
                %>

                <%--                <li><a href="#">1</a></li>--%>
                <%--                <li><a href="#">2</a></li>--%>
                <%--                <li><a href="#">3</a></li>--%>
                <%--                <li><a href="#">4</a></li>--%>
                <%--                <li><a href="#">5</a></li>--%>

                <%
                    if (pageObj.getPageNo() < pageObj.getPageTotal()) {
                %>
                <li>
                    <a href="./video.do?action=page&pageNo=<%=pageObj.getPageNo()+1%>&pageSize=<%=pageObj.getPageSize()%>&parm=<%=parm%>&category=<%=category%>"
                       aria-label="Next">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>
                <li>
                    <a href="./video.do?action=page&pageNo=<%=pageObj.getPageTotal()%>&pageSize=<%=pageObj.getPageSize()%>&parm=<%=parm%>&category=<%=category%>">末页</a>
                </li>
                <%
                    }
                %>
            </ul>
        </nav>
    </div>

</div>

<script type="text/javascript">

</script>
</body>
</html>
